<%--
  Created by IntelliJ IDEA.
  User: 86150
  Date: 2020/9/23
  Time: 9:55
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html class="no-js" lang="zxx">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="meta description">
    <title></title>

    <!--=== Favicon ===-->
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/static/assets/img/favicon.ico" type="image/x-icon" />

    <!-- Google fonts include -->
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,900%7CYesteryear" rel="stylesheet">

    <!-- All Vendor & plugins CSS include -->
    <link href="${pageContext.request.contextPath}/static/assets/css/vendor.css" rel="stylesheet">
    <!-- Main Style CSS -->
    <link href="${pageContext.request.contextPath}/static/assets/css/style.css" rel="stylesheet">

    <!--[if lt IE 9]>
    <script src="/oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="/oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

</head>

<body>

<!-- Start Header Area -->
<header class="header-area">
    <!-- main header start -->
    <div class="main-header d-none d-lg-block">
        <!-- header top start -->
        <div class="header-top bdr-bottom">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-6">
                    </div>
                    <div class="col-lg-6 text-right">
                        <div class="header-top-settings">
                            <ul class="nav align-items-center justify-content-end">
                                <li class="language">
                                    <span>欢迎来到花海花卉店</span>

                                </li>
                                <li class="curreny-wrap">
                                    <span>${empty user ? '游客': user.uname}</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- header top end -->

        <!-- header middle area start -->
        <div class="header-main-area sticky">
            <div class="container">
                <div class="row align-items-center position-relative">

                    <!-- start logo area -->
                    <div class="col-lg-3">
                        <div class="logo">
                            <a href="index.html">
                                <img src="${pageContext.request.contextPath}/static/assets/img/logo/logo.png" alt="">
                            </a>
                        </div>
                    </div>
                    <!-- start logo area -->

                    <!-- main menu area start -->
                    <div class="col-lg-6 position-static">
                        <div class="main-menu-area">
                            <div class="main-menu">
                                <!-- main menu navbar start -->
                                <nav class="desktop-menu">
                                    <ul>
                                        <li><a href="${pageContext.request.contextPath}/flower/indexInit">主页</a></li>
                                        <li><a href="${pageContext.request.contextPath}/flower/shopInit">花海</a></li>
                                        <li><a href="${pageContext.request.contextPath}/flower/productInit">花卉信息</a></li>
                                    </ul>
                                </nav>
                                <!-- main menu navbar end -->
                            </div>
                        </div>
                    </div>
                    <!-- main menu area end -->

                    <!-- mini cart area start -->
                    <div class="col-lg-3">
                        <div class="header-configure-wrapper">
                            <div class="header-configure-area">
                                <ul class="nav justify-content-end">
                                    <li>
                                        <a href="#" class="offcanvas-btn">
                                            <i class="lnr lnr-magnifier"></i>
                                        </a>
                                    </li>
                                    <li class="user-hover">
                                        <a href="#">
                                            <i class="lnr lnr-user"></i>
                                        </a>
                                        <ul class="dropdown-list">
                                            <li><a href="${pageContext.request.contextPath}/user/userLoginInit">登录/切换账号</a></li>
                                            <li><a href="${pageContext.request.contextPath}/user/userRegisterInit/">注册</a></li>
                                            <li><a href="#">个人信息</a></li>
                                        </ul>
                                    </li>
                                    <li>
                                        <a href="${pageContext.request.contextPath}/flower/wishListInit">
                                            <i class="lnr lnr-heart"></i>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" class="minicart-btn">
                                            <i class="lnr lnr-cart"></i>
                                            <div class="notification">${caList.size()}</div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <!-- mini cart area end -->

                </div>
            </div>
        </div>
        <!-- header middle area end -->
    </div>
    <!-- main header start -->

    <!-- mobile header start -->
    <div class="mobile-header d-lg-none d-md-block sticky">
        <!--mobile header top start -->
        <div class="container">
            <div class="row align-items-center">
                <div class="col-12">
                    <div class="mobile-main-header">
                        <div class="mobile-logo">
                            <a href="index.html">
                                <img src="${pageContext.request.contextPath}/static/assets/img/logo/logo.png" alt="Brand Logo">
                            </a>
                        </div>
                        <div class="mobile-menu-toggler">
                            <div class="mini-cart-wrap">
                                <a href="#">
                                    <i class="lnr lnr-cart"></i>
                                </a>
                            </div>
                            <div class="mobile-menu-btn">
                                <div class="off-canvas-btn">
                                    <i class="lnr lnr-menu"></i>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- mobile header top start -->
    </div>
    <!-- mobile header end -->
</header>
<!-- end Header Area -->

<!-- off-canvas menu start -->
<aside class="off-canvas-wrapper">
    <div class="off-canvas-overlay"></div>
    <div class="off-canvas-inner-content">
        <div class="btn-close-off-canvas">
            <i class="lnr lnr-cross"></i>
        </div>

        <div class="off-canvas-inner">
            <!-- search box start -->
            <div class="search-box-offcanvas">
                <form>
                    <input type="text" placeholder="Search Here...">
                    <button class="search-btn"><i class="lnr lnr-magnifier"></i></button>
                </form>
            </div>
            <!-- search box end -->

            <!-- mobile menu start -->
            <div class="mobile-navigation">

                <!-- mobile menu navigation start -->
                <nav>
                    <ul class="mobile-menu">
                        <li><a href="index.html">Home</a></li>
                        <li><a href="shop.html">Shop</a></li>
                        <li><a href="product-details.html">花卉信息</a></li>
                    </ul>
                </nav>
                <!-- mobile menu navigation end -->
            </div>
            <!-- mobile menu end -->

            <div class="mobile-settings">
                <ul class="nav">
                    <li>
                        <div class="dropdown mobile-top-dropdown">
                            <a href="#" class="dropdown-toggle" id="currency" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                Currency
                                <i class="fa fa-angle-down"></i>
                            </a>
                            <div class="dropdown-menu" aria-labelledby="currency">
                                <a class="dropdown-item" href="#">$ USD</a>
                                <a class="dropdown-item" href="#">$ EURO</a>
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="dropdown mobile-top-dropdown">
                            <a href="#" class="dropdown-toggle" id="myaccount" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                My Account
                                <i class="fa fa-angle-down"></i>
                            </a>
                            <div class="dropdown-menu" aria-labelledby="myaccount">
                                <a class="dropdown-item" href="#">my account</a>
                                <a class="dropdown-item" href="#"> login</a>
                                <a class="dropdown-item" href="#">register</a>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>

            <!-- offcanvas widget area start -->
            <div class="offcanvas-widget-area">
                <div class="off-canvas-contact-widget">
                    <ul>
                        <li><i class="fa fa-mobile"></i>
                            <a href="#">0123456789</a>
                        </li>
                        <li><i class="fa fa-envelope-o"></i>
                            <a href="#">info@yourdomain.com</a>
                        </li>
                    </ul>
                </div>
                <div class="off-canvas-social-widget">
                    <a href="#"><i class="fa fa-facebook"></i></a>
                    <a href="#"><i class="fa fa-twitter"></i></a>
                    <a href="#"><i class="fa fa-pinterest-p"></i></a>
                    <a href="#"><i class="fa fa-linkedin"></i></a>
                    <a href="#"><i class="fa fa-youtube-play"></i></a>
                </div>
            </div>
            <!-- offcanvas widget area end -->
        </div>
    </div>
</aside>
<!-- off-canvas menu end -->



<!-- main wrapper start -->
<main>
    <!-- breadcrumb area start -->
    <div class="breadcrumb-area common-bg">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="breadcrumb-wrap">
                        <nav aria-label="breadcrumb">
                            <h1>花卉信息</h1>
                            <ul class="breadcrumb">
                                <li class="breadcrumb-item"><a href="${pageContext.request.contextPath}/flower/indexInit"><i class="fa fa-home"></i></a></li>
                                <li class="breadcrumb-item active" aria-current="page">花卉信息</li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- breadcrumb area end -->
<form action="${pageContext.request.contextPath}/flower/addCart" method="post" id="form" ></form>
    <!-- page main wrapper start -->
    <div class="shop-main-wrapper section-space">
        <div class="container">
            <div class="row">
                <!-- product details wrapper start -->
                <div class="col-lg-12 order-1 order-lg-2">
                    <!-- product details inner end -->
                    <div class="product-details-inner">
                        <div class="row">
                            <div class="col-lg-5">
                                <div class="product-large-slider">
                                    <div class="pro-large-img img-zoom">
                                        <img src="${pageContext.request.contextPath}/static/assets/img/product/product-details-img1.jpg" alt="product-details" />
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-7">
                                <div class="product-details-des">
                                    <h3 class="product-name">${flower.fname}</h3>
                                    <br>

                                    <div class="price-box">
                                        <span class="price-regular">￥${flower.fprice}</span>
                                    </div>
                                    <br>
                                    <div class="ratings d-flex">

                                        <div class="pro-review">
                                            <span> 已售出 :  ${flower.saleNum}</span>

                                        </div>
                                    </div>
                                    <br>

                                    <h5 class="offer-text">到货时间:</h5>
                                    <br>

                                    <h3 >${flower.ftime}</h3>
                                    <%--<div class="product-countdown" data-countdown="2019/07/25"></div>--%>
                                    <div class="availability">
                                        <i class="fa fa-check-circle"></i>
                                        <span>库存充足</span>
                                    </div>

                                    <p class="pro-desc">
                                        花卉介绍：
                                        ${flower.fdecr}
                                    </p>
                                    <div class="quantity-cart-box d-flex align-items-center">
                                        <h5>数量:</h5>
                                        <div class="quantity">
                                            <div class="pro-qty"><input type="text" value="1" min="1" id="count" name="count"></div>
                                        <input type="hidden" name="fid" id="fid" value="${flower.id}">

                                        </div>
                                        <div class="action_link">
                                            <a class="btn btn-cart2" href="javascript:void(0)" onclick="addCart()">添加到购物车</a><h5>${msg}</h5>
                                        </div>
                                    </div>
                                    <%--<div class="pro-size">--%>
                                        <%--<h5>尺寸 :</h5>--%>
                                        <%--<select class="nice-select">--%>
                                            <%--<option>S</option>--%>
                                            <%--<option>M</option>--%>
                                            <%--<option>L</option>--%>
                                            <%--<option>XL</option>--%>
                                        <%--</select>--%>
                                    <%--</div>--%>
                                    <div class="color-option">
                                        <h5>颜色 :</h5>
                                      ${flower.color}
                                    </div>
                                    <div class="useful-links">
                                        <a href="javascript:void(0)"  data-toggle="tooltip" title="Compare" ><i
                                                class="lnr lnr-sync"  onclick="similarly()"></i>相似</a>
                                        <a href="javascript:void(0)" data-toggle="tooltip" title="Wishlist"><i
                                                class="lnr lnr-heart" onclick="addWish(${flower.id})"></i>加入心愿单</a>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- product details inner end -->

                    <!-- product details reviews start -->
                    <div class="product-details-reviews section-space pb-0">
                        <div class="row">
                            <div class="col-lg-12">
                                <div class="product-review-info">
                                    <ul class="nav review-tab">
                                        <%--<li>--%>
                                            <%--<a class="active" data-toggle="tab" href="#tab_one">description</a>--%>
                                        <%--</li>--%>
                                        <%--<li>--%>
                                            <%--<a data-toggle="tab" href="#tab_two">information</a>--%>
                                        <%--</li>--%>
                                        <%--<li>--%>
                                            <%--<a data-toggle="tab" href="#tab_three">reviews (1)</a>--%>
                                        <%--</li>--%>
                                    <%--</ul>--%>
                                    <%--<div class="tab-content reviews-tab">--%>
                                        <%--&lt;%&ndash;<div class="tab-pane fade show active" id="tab_one">&ndash;%&gt;--%>
                                            <%--&lt;%&ndash;<div class="tab-one">&ndash;%&gt;--%>
                                                <%--&lt;%&ndash;&lt;%&ndash;<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam&ndash;%&gt;&ndash;%&gt;--%>
                                                    <%--&lt;%&ndash;&lt;%&ndash;fringilla augue nec est tristique auctor. Ipsum metus feugiat&ndash;%&gt;&ndash;%&gt;--%>
                                                    <%--&lt;%&ndash;&lt;%&ndash;sem, quis fermentum turpis eros eget velit. Donec ac tempus&ndash;%&gt;&ndash;%&gt;--%>
                                                    <%--&lt;%&ndash;&lt;%&ndash;ante. Fusce ultricies massa massa. Fusce aliquam, purus eget&ndash;%&gt;&ndash;%&gt;--%>
                                                    <%--&lt;%&ndash;&lt;%&ndash;sagittis vulputate, sapien libero hendrerit est, sed commodo&ndash;%&gt;&ndash;%&gt;--%>
                                                    <%--&lt;%&ndash;&lt;%&ndash;augue nisi non neque.Cras neque metus, consequat et blandit et,&ndash;%&gt;&ndash;%&gt;--%>
                                                    <%--&lt;%&ndash;&lt;%&ndash;luctus a nunc. Etiam gravida vehicula tellus, in imperdiet&ndash;%&gt;&ndash;%&gt;--%>
                                                    <%--&lt;%&ndash;&lt;%&ndash;ligula euismod eget. Pellentesque habitant morbi tristique&ndash;%&gt;&ndash;%&gt;--%>
                                                    <%--&lt;%&ndash;&lt;%&ndash;senectus et netus et malesuada fames ac turpis egestas. Nam&ndash;%&gt;&ndash;%&gt;--%>
                                                    <%--&lt;%&ndash;&lt;%&ndash;erat mi, rutrum at sollicitudin rhoncus</p>&ndash;%&gt;&ndash;%&gt;--%>
                                            <%--&lt;%&ndash;</div>&ndash;%&gt;--%>
                                        <%--&lt;%&ndash;</div>&ndash;%&gt;--%>
                                        <%--<div class="tab-pane fade" id="tab_two">--%>
                                            <%--<table class="table table-bordered">--%>
                                                <%--<tbody>--%>
                                                <%--<tr>--%>
                                                    <%--<td>color</td>--%>
                                                    <%--<td>black, blue, red</td>--%>
                                                <%--</tr>--%>
                                                <%--<tr>--%>
                                                    <%--<td>size</td>--%>
                                                    <%--<td>L, M, S</td>--%>
                                                <%--</tr>--%>
                                                <%--</tbody>--%>
                                            <%--</table>--%>
                                        <%--</div>--%>
                                        <%--<div class="tab-pane fade" id="tab_three">--%>
                                            <%--<form action="#" class="review-form">--%>
                                                <%--<h5>1 review for <span>Chaz Kangeroo</span></h5>--%>
                                                <%--<div class="total-reviews">--%>
                                                    <%--<div class="rev-avatar">--%>
                                                        <%--<img src="${pageContext.request.contextPath}/static/assets/img/about/avatar.jpg" alt="">--%>
                                                    <%--</div>--%>
                                                    <%--<div class="review-box">--%>
                                                        <%--<div class="ratings">--%>
                                                            <%--<span class="good"><i class="fa fa-star"></i></span>--%>
                                                            <%--<span class="good"><i class="fa fa-star"></i></span>--%>
                                                            <%--<span class="good"><i class="fa fa-star"></i></span>--%>
                                                            <%--<span class="good"><i class="fa fa-star"></i></span>--%>
                                                            <%--<span><i class="fa fa-star"></i></span>--%>
                                                        <%--</div>--%>
                                                        <%--<div class="post-author">--%>
                                                            <%--<p><span>admin -</span> 30 Mar, 2019</p>--%>
                                                        <%--</div>--%>
                                                        <%--<p>Aliquam fringilla euismod risus ac bibendum. Sed sit--%>
                                                            <%--amet sem varius ante feugiat lacinia. Nunc ipsum nulla,--%>
                                                            <%--vulputate ut venenatis vitae, malesuada ut mi. Quisque--%>
                                                            <%--iaculis, dui congue placerat pretium, augue erat--%>
                                                            <%--accumsan lacus</p>--%>
                                                    <%--</div>--%>
                                                <%--</div>--%>
                                                <%--<div class="form-group row">--%>
                                                    <%--<div class="col">--%>
                                                        <%--<label class="col-form-label"><span class="text-danger">*</span>--%>
                                                            <%--Your Name</label>--%>
                                                        <%--<input type="text" class="form-control" required>--%>
                                                    <%--</div>--%>
                                                <%--</div>--%>
                                                <%--<div class="form-group row">--%>
                                                    <%--<div class="col">--%>
                                                        <%--<label class="col-form-label"><span class="text-danger">*</span>--%>
                                                            <%--Your Email</label>--%>
                                                        <%--<input type="email" class="form-control" required>--%>
                                                    <%--</div>--%>
                                                <%--</div>--%>
                                                <%--<div class="form-group row">--%>
                                                    <%--<div class="col">--%>
                                                        <%--<label class="col-form-label"><span class="text-danger">*</span>--%>
                                                            <%--Your Review</label>--%>
                                                        <%--<textarea class="form-control" required></textarea>--%>
                                                        <%--<div class="help-block pt-10"><span--%>
                                                                <%--class="text-danger">Note:</span>--%>
                                                            <%--HTML is not translated!--%>
                                                        <%--</div>--%>
                                                    <%--</div>--%>
                                                <%--</div>--%>
                                                <%--<div class="form-group row">--%>
                                                    <%--<div class="col">--%>
                                                        <%--<label class="col-form-label"><span class="text-danger">*</span>--%>
                                                            <%--Rating</label>--%>
                                                        <%--&nbsp;&nbsp;&nbsp; Bad&nbsp;--%>
                                                        <%--<input type="radio" value="1" name="rating">--%>
                                                        <%--&nbsp;--%>
                                                        <%--<input type="radio" value="2" name="rating">--%>
                                                        <%--&nbsp;--%>
                                                        <%--<input type="radio" value="3" name="rating">--%>
                                                        <%--&nbsp;--%>
                                                        <%--<input type="radio" value="4" name="rating">--%>
                                                        <%--&nbsp;--%>
                                                        <%--<input type="radio" value="5" name="rating" checked>--%>
                                                        <%--&nbsp;Good--%>
                                                    <%--</div>--%>
                                                <%--</div>--%>
                                                <%--<div class="buttons">--%>
                                                    <%--<button class="sqr-btn" type="submit">Continue</button>--%>
                                                <%--</div>--%>
                                            <%--</form> <!-- end of review-form -->--%>
                                        <%--</div>--%>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- product details reviews end -->
                </div>
                <!-- product details wrapper end -->
            </div>
        </div>
    </div>
    <!-- page main wrapper end -->

    <!-- related product area start -->
    <section class="related-products">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="section-title text-center">
                        <h2>相似花卉</h2>
                        <p>生命之脚就是湖，就是照顾每一个孩子。</p>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-12">
                    <div class="product-carousel--4 slick-row-15 slick-sm-row-10 slick-arrow-style">

<c:forEach items="${sList}" var="s">
                        <!-- product single item start -->
                        <div class="product-item">
                            <figure class="product-thumb">
                                <a href="product-details.html">
                                    <img class="pri-img" src="${pageContext.request.contextPath}/static/assets/img/product/product-5.jpg" alt="product">
                                    <img class="sec-img" src="${pageContext.request.contextPath}/static/assets/img/product/product-6.jpg" alt="product">
                                </a>
                                <div class="product-badge">
                                    <div class="product-label new">
                                        <span>相似</span>
                                    </div>
                                </div>
                                <input type="hidden" id="fid1" value="${s.id}">
                                <div class="button-group">
                                    <a href="javascript:void(0)" data-toggle="tooltip" data-placement="left" title=添加到心愿单"  onclick="addWish(${s.id})"><i class="lnr lnr-heart"></i></a>
                                    <a href="javascript:void(0)"  ><span data-toggle="tooltip" data-placement="left" title="添加到购物车" onclick="addCart(${s.id})"><i class="lnr lnr-cart"></i></span></a>
                                    <a href="javascript:void(0)" data-toggle="tooltip" data-placement="left" title="查看详细信息" onclick="toFlowerInfo(${s.id})"><i class="lnr lnr-magnifier"></i></a>
                                </div>
                            </figure>
                            <div class="product-caption">
                                <p class="product-name">
                                    <a href="product-details.html">${s.fname}</a>
                                </p>
                                <div class="price-box">
                                    <span class="price-regular">￥${s.fprice}</span>
                                </div>
                            </div>
                        </div>
                        <!-- product single item end -->
</c:forEach>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- related product area end -->
</main>
<!-- main wrapper end -->

<!-- Start Footer Area Wrapper -->
<footer class="footer-wrapper">

    <!-- footer widget area start -->
    <div class="footer-widget-area">
        <div class="container">
            <div class="footer-widget-inner section-space">
                <div class="row mbn-30">
                    <!-- footer widget item start -->
                    <div class="col-lg-5 col-md-6 col-sm-8">
                        <div class="footer-widget-item mb-30">
                            <div class="footer-widget-title">
                                <h5>联系我们</h5>
                            </div>
                            <ul class="footer-widget-body accout-widget">
                                <li class="address">
                                    <em><i class="lnr lnr-map-marker"></i></em>
                                    地址：窝窝村
                                </li>
                                <li class="email">
                                    <em><i class="lnr lnr-envelope"></i>邮箱: </em>
                                    <a href="mailto:test@yourdomain.com">yourmail@gmail.com</a>
                                </li>
                                <li class="phone">
                                    <em><i class="lnr lnr-phone-handset"></i> 电话: </em>
                                    <a href="tel:(012)800456789-987">(012) 800 456 789-987</a>
                                </li>
                            </ul>
                            <%--<div class="payment-method">--%>
                            <%--<img src="${pageContext.request.contextPath}/static/assets/img/payment-pic.png" alt="payment method">--%>
                            <%--</div>--%>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <!-- footer widget area end -->
    <!-- footer bottom area start -->
    <div class="footer-bottom-area">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-md-6 order-2 order-md-1">
                    <div class="copyright-text">
                        <p>Copyright &copy; 2019.Company name All rights reserved.</p>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <!-- footer bottom area end -->

</footer>
<!-- End Footer Area Wrapper -->

    <!-- footer bottom area start -->
    <div class="footer-bottom-area">
        <div class="container">
            <div class="row align-items-center">

                <div class="col-md-6 order-1 order-md-2">
                    <div class="footer-social-link">
                        <a href="#"><i class="fa fa-twitter"></i></a>
                        <a href="#"><i class="fa fa-facebook"></i></a>
                        <a href="#"><i class="fa fa-linkedin"></i></a>
                        <a href="#"><i class="fa fa-instagram"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- footer bottom area end -->

</footer>
<!-- End Footer Area Wrapper -->
<%--购物车弹出框--%>
<!-- Quick view modal start -->
<div class="modal" id="quick_view">
    <div class="modal-dialog modal-lg modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body">
                <!-- product details inner end -->
                <div class="product-details-inner">
                    <div class="row">
                        <div class="col-lg-5 col-md-5">
                            <div class="product-large-slider">
                                <div class="pro-large-img">
                                    <img src="${pageContext.request.contextPath}/static/assets/img/product/product-details-img1.jpg" alt="product-details" />
                                </div>
                                <div class="pro-large-img">
                                    <img src="${pageContext.request.contextPath}/static/assets/img/product/product-details-img2.jpg" alt="product-details" />
                                </div>
                                <div class="pro-large-img">
                                    <img src="${pageContext.request.contextPath}/static/assets/img/product/product-details-img3.jpg" alt="product-details" />
                                </div>
                                <div class="pro-large-img">
                                    <img src="${pageContext.request.contextPath}/static/assets/img/product/product-details-img4.jpg" alt="product-details" />
                                </div>
                            </div>
                            <div class="pro-nav slick-row-10 slick-arrow-style">
                                <div class="pro-nav-thumb">
                                    <img src="${pageContext.request.contextPath}/static/assets/img/product/product-details-img1.jpg" alt="product-details" />
                                </div>
                                <div class="pro-nav-thumb">
                                    <img src="${pageContext.request.contextPath}/static/assets/img/product/product-details-img2.jpg" alt="product-details" />
                                </div>
                                <div class="pro-nav-thumb">
                                    <img src="${pageContext.request.contextPath}/static/assets/img/product/product-details-img3.jpg" alt="product-details" />
                                </div>
                                <div class="pro-nav-thumb">
                                    <img src="${pageContext.request.contextPath}/static/assets/img/product/product-details-img4.jpg" alt="product-details" />
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-7 col-md-7">
                            <div class="product-details-des quick-details">
                                <h3 class="product-name">Orchid flower white stick</h3>
                                <div class="ratings d-flex">
                                    <span><i class="lnr lnr-star"></i></span>
                                    <span><i class="lnr lnr-star"></i></span>
                                    <span><i class="lnr lnr-star"></i></span>
                                    <span><i class="lnr lnr-star"></i></span>
                                    <span><i class="lnr lnr-star"></i></span>
                                    <div class="pro-review">
                                        <span>1 Reviews</span>
                                    </div>
                                </div>
                                <div class="price-box">
                                    <span class="price-regular">$70.00</span>
                                    <span class="price-old"><del>$90.00</del></span>
                                </div>
                                <h5 class="offer-text"><strong>Hurry up</strong>! offer ends in:</h5>
                                <div class="product-countdown" data-countdown="2019/08/25"></div>
                                <div class="availability">
                                    <i class="fa fa-check-circle"></i>
                                    <span>200 in stock</span>
                                </div>
                                <p class="pro-desc">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
                                    eirmod tempor invidunt ut labore et dolore magna aliquyam erat.</p>
                                <div class="quantity-cart-box d-flex align-items-center">
                                    <h5>qty:</h5>
                                    <div class="quantity">
                                        <div class="pro-qty"><input type="text" value="1"></div>
                                    </div>
                                    <div class="action_link">
                                        <a class="btn btn-cart2" href="#">Add to cart</a>
                                    </div>
                                </div>
                                <div class="useful-links">
                                    <a href="#" data-toggle="tooltip" title="Compare"><i
                                            class="lnr lnr-sync"></i>compare</a>
                                    <a href="#" data-toggle="tooltip" title="Wishlist"><i
                                            class="lnr lnr-heart"></i>wishlist</a>
                                </div>
                                <div class="like-icon">
                                    <a class="facebook" href="#"><i class="fa fa-facebook"></i>like</a>
                                    <a class="twitter" href="#"><i class="fa fa-twitter"></i>tweet</a>
                                    <a class="pinterest" href="#"><i class="fa fa-pinterest"></i>save</a>
                                    <a class="google" href="#"><i class="fa fa-google-plus"></i>share</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> <!-- product details inner end -->
            </div>
        </div>
    </div>
</div>
<!-- Quick view modal end -->
<%--购物车弹出框--%>
<!-- offcanvas search form start -->
<div class="offcanvas-search-wrapper">
    <div class="offcanvas-search-inner">
        <div class="offcanvas-close">
            <i class="lnr lnr-cross"></i>
        </div>
        <div class="container">
            <div class="offcanvas-search-box">
                <form class="d-flex bdr-bottom w-100" action="${pageContext.request.contextPath}/flower/shopInit" method="post" id="selForm">
                    <input type="text" placeholder="查询花名" name="fname" id="fname">

                    <button class="search-btn" onclick="selAll()"><i class="lnr lnr-magnifier"></i></button>
                </form>
            </div>
        </div>
    </div>
</div>
<!-- offcanvas search form end -->

<%--//购物车--%>
<!-- offcanvas mini cart start -->
<div class="offcanvas-minicart-wrapper" id="cart">
    <div class="minicart-inner">
        <div class="offcanvas-overlay"></div>
        <div class="minicart-inner-content">
            <div class="minicart-close">
                <i class="lnr lnr-cross"></i>
            </div>
            <div class="minicart-content-box">
                <div class="minicart-item-wrapper">
                    <%--<c:forEach items="${caList}" var="ca">--%>
                    <c:forEach items="${caList}" var="ca">

                        <ul>
                            <li class="minicart-item">
                                <div class="minicart-thumb">
                                    <a href="product-details.html">
                                        <img src="${pageContext.request.contextPath}/static/assets/img/cart/cart-1.jpg" alt="product">
                                    </a>
                                </div>
                                <div class="minicart-content">
                                    <h3 class="product-name">
                                        <a href="product-details.html">${ca.fname}</a>
                                    </h3>
                                    <p>
                                        <span class="cart-quantity">${ca.count}<strong>&times;</strong></span>
                                        <span class="cart-price">￥${ca.fprice}</span>
                                    </p>
                                </div>
                                <button class="minicart-remove" onclick="deleteCart(${ca.id})"><i class="lnr lnr-cross" ></i></button>
                            </li>

                        </ul>
                        <%--</c:forEach>--%>
                    </c:forEach>
                </div>

                <div class="minicart-pricing-box">
                    <ul>

                        <li class="total">
                            <span>总计</span>
                            <span><strong>${sum}</strong></span>
                        </li>
                    </ul>
                </div>

                <div class="minicart-button">
                    <a href="#"><i class="fa fa-shopping-cart"></i> 结算</a>

                </div>
            </div>
        </div>
    </div>
</div>
<!-- offcanvas mini cart end -->
<%--//购物车--%>
<!-- Scroll to top start -->
<div class="scroll-top not-visible">
    <i class="fa fa-angle-up"></i>
</div>
<!-- Scroll to Top End -->

<!-- All vendor & plugins & active js include here -->
<!--All Vendor Js -->
<script src="${pageContext.request.contextPath}/static/assets/js/vendor.js"></script>
<!-- Active Js -->
<script src="${pageContext.request.contextPath}/static/assets/js/active.js"></script>

<script src="${pageContext.request.contextPath}/static/js/jquery-1.8.2.min.js"></script>

<script>

    $(function () {

    })



    function selAll() {
        $("#selForm").submit()
    }
   function addCart() {
   var fid = $("#fid1").val()
   var count = $("#count").val()

       $.post("${pageContext.request.contextPath}/flower/addCart",{"fid":fid,"count":count},function (r){
           alert(r.msg);
           location.href ="${pageContext.request.contextPath}/flower/productInit"
       })


   }

    function toFlowerInfo(id) {
        location.href ="${pageContext.request.contextPath}/flower/productInit?id=" + id
    }
    function addWish(id) {

        $.post("${pageContext.request.contextPath}/flower/addwish",{"id":id},function (r){
            alert(r.msg);
        })
    }
function similarly() {

    var type = ${flower.type}
    var color = '${flower.color}'
        <%--$.post("${pageContext.request.contextPath}/flower/productInit",{"type":type,"color":color},function (r){--%>
            <%--alert(r.msg);--%>
        <%--})--%>
    location.href ="${pageContext.request.contextPath}/flower/productInit?type=" + type+"&color="+color

}
function deleteCart(id) {
    $.post("${pageContext.request.contextPath}/cart/delCart",{"id":id},function (r){
        alert(r.msg);
        location.href ="${pageContext.request.contextPath}/flower/shopInit"
    })


}

</script>
</body>

</html>
